<template>
	<div>
		<el-row class="btn-group">
			<el-button type="primary" @click="openDialog">导入名单</el-button>
			<el-button type="success" @click="exportBtn(tableData)"
				>导出名单</el-button
			>
		</el-row>
		<h1>最近一次考试成绩</h1>
		<el-table :data="tableData" border stripe style="width: 100%">
			<el-table-column
				property="studentID"
				label="学号"
				width="200"
			></el-table-column>
			<el-table-column property="studentName" label="姓名"></el-table-column>
			<el-table-column property="lastScore" label="分数"></el-table-column>
			<el-table-column property="hscore" label="最高分"></el-table-column>
		</el-table>
		<div style="margin: 80px 0">
			<h1>最近一次考试奖励名单</h1>
			<el-table :data="tableData2" border stripe style="width: 100%">
				<el-table-column
					property="studentID"
					label="学号"
					width="200"
				></el-table-column>
				<el-table-column property="studentName" label="姓名"></el-table-column>
				<el-table-column property="lastScore" label="分数"></el-table-column>
				<el-table-column property="hscore" label="最高分"></el-table-column>
			</el-table>
		</div>
		<div style="margin: 80px 0">
			<h1>最近一次考试缺考名单</h1>
			<el-table :data="tableData3" border stripe style="width: 100%">
				<el-table-column
					property="studentID"
					label="学号"
					width="200"
				></el-table-column>
				<el-table-column property="studentName" label="姓名"></el-table-column>
			</el-table>
		</div>
		<el-dialog title="报名名单" width="50%" center v-model="dialogIsVisvited">
			<import-student-score @success="closeDialog"></import-student-score>
		</el-dialog>
	</div>
</template>

<script>
import ImportStudentScore from "@/components/ImportStudentScore.vue";
let XLSX = require("xlsx");

export default {
	components: { ImportStudentScore },
	name: "AbsenceStudent",
	data() {
		return {
			dialogIsVisvited: false,
			tableData: [],
			tableData2: [],
			tableData3: [],
			ksTime: "20229",
		};
	},
	commponents: {
		ImportStudentScore,
	},
	methods: {
		exportBtn(tableData) {
			let worksheet = XLSX.utils.json_to_sheet(tableData);
			let workbook = XLSX.utils.book_new();
			XLSX.utils.book_append_sheet(workbook, worksheet, "第一页");
			XLSX.writeFile(workbook, "学生成绩.xlsx");
		},
		openDialog() {
			this.dialogIsVisvited = true;
		},
		refreshData() {
			let myDate = new Date();
			this.ksTime = "" + myDate.getFullYear();
			let mouth = parseInt(myDate.getMonth() / 3) * 3;
			this.ksTime += mouth;
			fetch(
				`${this.$store.getters.point}/score/getScoresbyTimes/${this.ksTime}`
			)
				.then((response) => response.text())
				.then((result) => {
					this.tableData = JSON.parse(result).data;
				});
			fetch(`${this.$store.getters.point}/score/getReward/${this.ksTime}`)
				.then((response) => response.text())
				.then((result) => {
					this.tableData2 = JSON.parse(result).data;
				});
			fetch(`${this.$store.getters.point}/score/unJoin/${this.ksTime}`)
				.then((response) => response.text())
				.then((result) => {
					this.tableData3 = JSON.parse(result).data;
				});
		},
		closeDialog() {
			this.dialogIsVisvited = false;
			this.refreshData();
		},
	},
	mounted() {
		this.refreshData();
	},
};
</script>

<style scoped>
.btn-group {
	margin-bottom: 30px;
}
</style>
